<div class="content">
  <h1 class="title">Visual Debugger</h1>

  <div class="features_list_container debugger_features_list debugger">
    <ul class="features_list margined">
      <li><a href="#control_flow">Control Flow</a></li>
      <li><a href="#breakpoints">Breakpoints</a></li>
      <li><a href="#display_data">Display Data</a></li>
      <li><a href="#exceptions">Exceptions</a></li>
      <li class="bottom"><a href="#multidebugging">Multidebugging</a></li>
    </ul>
    <ul class="features_list">
      <li><a href="#simulateneous_several_flash">Debugging of multiple Flash applications</a></li>
      <li><a href="#simulateneous_flash_net">Debugging of Flash and .Net applications</a></li>
      <li><a href="#listening_mode">Listeninig Mode</a></li>
      <li><a href="#flashlog_window">Flashlog Window</a></li>
    </ul>
  </div>

  <!--
  <div class="features_descr">
    A powerful and handy CodeDrive Debugger allows you to easily find and correct errors in your applications
    and take your Flash application development to a new level.
  </div>
  -->

  <div class="feature" id="mainFeatureBlock">
    <p>
      Powerful and convenient CodeDrive Flash Debugger helps find errors effectively and improve your code faster.
      All state of the art Flash debugging features are perfectly implemented in CodeDrive.
    </p>
    <ul class="bulleted_list">
      <li>Conditional and HitCount breakpoints</li>
      <li>Watch window</li>
      <li>Local Variables</li>
      <li>Stack Frame</li>
      <li>Tooltips</li>
    </ul>
    <p>
      CodeDrive Debugger allows debugging multiple SWFs and joint debugging .NET and Flash applications
      in a single debugging session in your Visual Studio environment. With CodeDrive Debugger you can save
      time and increase productivity when debugging client-server and multi-tier applications.
    </p>

  <div class="features_block">
    <a name="control_flow"></a>
    <h2>Control Flow</h2>
    <div class="feature">
      <div class="subsection">
        <h3 class="subsection_header">Start Debugging as in Visual Studio</h3>
        <a href="http://msdn.microsoft.com/en-us/library/fzbdb826.aspx">Visual Studio Start Debugging</a>
        <p>&quot;Starting execution&quot; is one of the most basic debugging functions.</p>
        <img class="lazyloaded bordered" width="396" height="162" src="/images/gray.gif" data-original="/images/debugger_features/start_debugging.png" alt="Start Debugging"/>
        {include file='include/to_the_top_block.tpl'}
      </div>
      <div class="subsection">
        <h3 class="subsection_header">Step Over / Step Into / Step Out</h3>
        <a href="http://msdn.microsoft.com/en-us/library/ek13f001.aspx">Visual Studio Stepping</a>
        <p>
          Stepping, one of the most common debugging procedures, is executing code by one line at a time.
        </p>
        <p>The Debug menu provides three commands for stepping through code:</p>
        <ul class="bulleted_list">
          <li>Step Into</li>
          <li>Step Over</li>
          <li>Step Out</li>
        </ul>
        <p>
          The only difference between <strong>Step Into</strong> and <strong>Step Over</strong> is the way they handle
          function calls. Either command instructs the debugger to execute the next line of code. If the line contains
          a function call, <strong>Step Into</strong> executes only the call itself, than halts at the first line of
          code inside the function. <strong>Step Over</strong> executes the entire function, then halts at the first
          line outside the function. Use <strong>Step Into</strong> if you want to look inside the function call.
          Use <strong>Step Over</strong> if you want to avoid stepping into functions.
        </p>
        <p>
          On a nested function call, <strong>Step Into</strong> steps into the most deeply nested function.
          If you use <strong>Step Into</strong> on a call like Func1(Func2()), the debugger steps into the function Func2.
        </p>
        <p>
          If you want to step into a specific nested function, use the <strong>Step Into Specific</strong> command
          from the shortcut menu. For more information, see
          <a href="http://msdn.microsoft.com/en-us/library/7ad07721.aspx">How to: Step Into a Specific Function</a>.
        </p>
        <p>
          Use <strong>Step Out</strong> when you are inside a function call and want to return to the calling function.
          <strong>Step Out</strong> resumes execution of your code until the function returns, then breaks at the
          return point in the calling function.
        </p>
        <img class="lazyloaded bordered" width="576" height="148" src="/images/gray.gif" data-original="/images/debugger_features/step_over.png" alt="Step Over"/>
        {include file='include/to_the_top_block.tpl'}
      </div>

      <div class="subsection">
        <h3 class="subsection_header">Break All</h3>
        <a href="http://msdn.microsoft.com/en-us/library/7z9se2d8.aspx">Visual Studio Break all</a>
        <p>
          When you are debugging an application with the Visual Studio debugger, your application is either
          running (executing) or it is in break mode. Most debugger features, such as evaluating expressions
          in the <strong>Watch</strong> window, are available only in break mode.
        </p>
        <img class="lazyloaded bordered" width="394" height="112" src="/images/gray.gif" data-original="/images/debugger_features/break_all.png" alt="Break All"/>
        {include file='include/to_the_top_block.tpl'}
      </div>

      <div class="subsection">
        <h3 class="subsection_header">Run to cursor</h3>
        <a href="http://msdn.microsoft.com/en-us/library/dbhfa1e0.aspx">Visual Studio Run to Cursor</a>
        <p>
          You can command the debugger to run your application until it reaches the location where the cursor is
          set. This location may be in a source window or the Disassembly window. The cursor means the insertion point
          that you set by clicking the window with the mouse.
        </p>
      </div>
    </div>
  </div>

  <div class="features_block">
    <a name="breakpoints"></a>
    <h2>Breakpoints</h2>
    <div class="feature">
      <p>
        A <i>breakpoint</i> is a signal that tells the debugger to temporarily suspend execution of your program
        at a certain point. When execution is suspended at a breakpoint, your program is said to be in break mode.
        Entering break mode does not stop or end the execution of your program; execution can be resumed at any time.
      </p>
      <img class="lazyloaded bordered" width="509" height="155" src="/images/gray.gif" data-original="/images/debugger_features/breakpoint.png" alt="Breakpoint"/>
      {include file='include/to_the_top_block.tpl'}

      <div class="subsection">
        <h3 class="subsection_header">Setting Breakpoint during Debugging</h3>
        <p>
          You can set additional breakpoints even when debugging session is already started.
        </p>
      </div>

      <div class="subsection">
        <h3 class="subsection_header">Conditional Breakpoints</h3>
        <a href="http://msdn.microsoft.com/en-us/library/7sye83ce.aspx">Visual Studio Conditional Breakpoints</a>
        <p>
          When working with a big code base, you can set a condition for a breakpoint
          to reach your breakpoint faster.
        </p>
        <img class="lazyloaded bordered" width="615" height="316" src="/images/gray.gif" data-original="/images/debugger_features/conditional_breakpoint.png" alt="Conditional Breakpoints"/>
        {include file='include/to_the_top_block.tpl'}
      </div>

      <div class="subsection">
        <h3 class="subsection_header">Breakpoint Hit Count</h3>
        <a href="http://msdn.microsoft.com/en-us/library/yy96wbwd.aspx">Visual Studio Breakpoint Hit Count</a>
        <p>
          By default, a breakpoint is triggered each time when it is reached by program execution flow.
          You can set a condition for a breakpoint to be triggered depending on number of times the breakpoint
          has been reached (Hit Count).
        </p>
        <img class="lazyloaded" width="483" height="216" src="/images/gray.gif" data-original="/images/debugger_features/breakpoint_hit_count.png" alt="Breakpoint Hit Count"/>
        {include file='include/to_the_top_block.tpl'}
      </div>

      <div class="subsection">
        <h3 class="subsection_header">Tracepoints</h3>
        <a href="http://msdn.microsoft.com/en-us/library/232dxah7.aspx">Visual Studio Trace Point</a>
        <p>
          Tracepoints are a new way to use breakpoints. A tracepoint is a breakpoint with a custom action associated
          with it. When the tracepoint is hit, it causes the debugger to perform the specified action instead of
          (or in addition to) breaking program execution.
        </p>
      </div>

      <div class="subsection">
        <h3 class="subsection_header">Breakpoints Window</h3>
        <a href="http://msdn.microsoft.com/en-us/library/02ckd1z7.aspx">Visual Studio BreakpointsWindow</a>
        <p>
          Breakpoints window provides a powerful means of manipulating breakpoints.
        </p>
        <img class="lazyloaded" width="590" height="184" src="/images/gray.gif" data-original="/images/debugger_features/breakpoints_window.png" alt="Breakpoints Window"/>
        {include file='include/to_the_top_block.tpl'}
      </div>
    </div>
  </div>

  <div class="features_block">
    <a name="display_data"></a>
    <h2>Display Data</h2>
    <div class="feature">
      <div class="subsection">
        <h3 class="subsection_header">
          Pinned DataTips (Import and Export DataTips, DataTip Value from the Last<br/>
          Debug Session, Adding comments to a DataTip)
        </h3>
        <a href="http://msdn.microsoft.com/en-us/library/ea46xwzd.aspx">Visual Studio DataTips</a>
        <p>
          DataTips provide a convenient way to view information about variables in your program during debugging.
          DataTips work only in break mode and only with variables that are in the current scope of execution.
        </p>
        <p>
          In Visual Studio 2010, DataTips can be pinned to a specific location in a source file, or they can
          float on top of all Visual Studio windows.
        </p>
        <img class="lazyloaded bordered" width="620" height="162" src="/images/gray.gif" data-original="/images/debugger_features/display_data.png" alt="Display Data"/>
        {include file='include/to_the_top_block.tpl'}
      </div>

      <div class="subsection">
        <h3 class="subsection_header">Locals</h3>
        <a href="http://msdn.microsoft.com/en-us/library/a6td98xe(VS.71).aspx">Visual Studio Locals</a>
        <p>
          The Locals window displays variables local to the current context.
        </p>
        <img class="lazyloaded" width="611" height="219" src="/images/gray.gif" data-original="/images/debugger_features/locals.png" alt="Locals"/>
        {include file='include/to_the_top_block.tpl'}
      </div>

      <div class="subsection">
        <h3 class="subsection_header">Hexadecimal display</h3>
        <a href="http://msdn.microsoft.com/en-us/library/56f3kd7d(v=VS.71).aspx">
          Visual Studio Changing the Numeric Format of Source Window
        </a>
        <p>
          You can set the numeric format used in the debugger windows to decimal or hexadecimal.
        </p>
        <img class="lazyloaded" width="611" height="219" src="/images/gray.gif" data-original="/images/debugger_features/hexadecimal_display.png" alt="Hexadecimal display"/>
        {include file='include/to_the_top_block.tpl'}
      </div>

      <div class="subsection">
        <h3 class="subsection_header">Debugger tooltips</h3>
        <img class="lazyloaded bordered" width="548" height="226" src="/images/gray.gif" data-original="/images/debugger_features/debugger_tooltips.png" alt="Debugger tooltips"/>
      </div>

      <div class="subsection">
        <h3 class="subsection_header">Call Stack Window</h3>
        <a href="http://msdn.microsoft.com/en-us/library/a3694ts5(v=vs.80).aspx">Visual Studio Call Stack</a>
        <p>
          By using the <strong>Call Stack</strong> window, you can view the function or procedure calls
          that are currently on the stack.
        </p>
        <img class="lazyloaded" width="614" height="174" src="/images/gray.gif" data-original="/images/debugger_features/call_stack.png" alt="Call Stack"/>
        {include file='include/to_the_top_block.tpl'}
      </div>

      <div class="subsection">
        <h3 class="subsection_header">Quick watch</h3>
        <p>
          The QuickWatch dialog box lets you examine and evaluate variables and expressions. Because QuickWatch
          is a modal dialog box, you have to close it before you can continue debugging. For more information, see
          <a href="http://msdn.microsoft.com/en-us/library/0taedcee.aspx">
            How to: Watch an Expression in the Debugger
          </a>.
          You can also edit the value of a variable in <strong>Quick Watch</strong>.
        </p>
        <a href="http://msdn.microsoft.com/en-us/library/cyzbs7s2.aspx">Visual Studio QuickWatch</a>
        <img class="lazyloaded" width="579" height="369" src="/images/gray.gif" data-original="/images/debugger_features/quick_watch.png" alt="Quick watch"/>
        {include file='include/to_the_top_block.tpl'}
      </div>

      <div class="subsection">
        <h3 class="subsection_header">Watch Window</h3>
        <a href="http://msdn.microsoft.com/en-us/library/0taedcee.aspx">Visual Studio Watch Window</a>
        <p>
          The <strong>Watch</strong> window is the place where you can enter variable names and expressions that you want
          to watch during a debugging session.
        </p>
        <img class="lazyloaded" width="530" height="192" src="/images/gray.gif" data-original="/images/debugger_features/watch_window.png" alt="Watch Window"/>
        {include file='include/to_the_top_block.tpl'}
      </div>

      <div class="subsection">
        <h3 class="subsection_header">Change variable values</h3>
        <a href="http://msdn.microsoft.com/en-us/library/aa6fy2x5.aspx">Visual Studio Edit Value in Variables Window</a>
        <p>
          The variable windows, <strong>Autos</strong>, <strong>Locals</strong>, and <strong>Watch</strong>, display
          the values of certain variables during a debugging session. The <strong>QuickWatch</strong> dialog box can
          also display variables. When the debugger is in a break mode, you can use the variable windows to edit the
          values of most variables that appear in these locations.
        </p>
      </div>

      <div class="subsection">
        <h3 class="subsection_header">Immediate Window</h3>
        <a href="http://msdn.microsoft.com/en-us/library/f177hahy(v=vs.80).aspx">Visual Studio Immediate Window</a>
        <p>
          The <strong>Immediate</strong> window is used at design time to debug and evaluate expressions, execute
          statements, print variable values, and so forth. It allows you to enter expressions to be evaluated or
          executed by the development language during debugging. To display the <strong>Immediate</strong> window,
          open a project for editing, then choose <strong>Windows</strong> from the <strong>Debug</strong> menu
          and select <strong>Immediate</strong>.
        </p>
        <img class="lazyloaded bordered" width="621" height="314" src="/images/gray.gif" data-original="/images/debugger_features/immediate_window.png" alt="Immediate Window"/>
        {include file='include/to_the_top_block.tpl'}
      </div>

      <div class="subsection">
        <h3 class="subsection_header">Trace output debug information</h3>
        <img class="lazyloaded bordered" width="568" height="263" src="/images/gray.gif" data-original="/images/debugger_features/trace_output.png" alt="Trace output"/>
      </div>
    </div>
  </div>

  <div class="features_block">
    <a name="exceptions"></a>
    <h2>Exceptions</h2>
    <div class="feature">
      <div class="subsection">
        <h3 class="subsection_header">Exception handling</h3>
        <a href="http://msdn.microsoft.com/en-us/library/x85tt0dd.aspx">Visual Studio Exceptionhandling</a>
        <p>
          The debugger can break execution of your application immediately when an exception occurs,
          giving you a chance to debug the exception before a handler is invoked.
        </p>
        <img class="lazyloaded bordered" width="620" height="411" src="/images/gray.gif" data-original="/images/debugger_features/exception_handling.png" alt="Exception handling"/>
        {include file='include/to_the_top_block.tpl'}
      </div>
    </div>
  </div>

  <div class="features_block">
    <a name="multidebugging"></a>
    <h2>Multidebugging</h2>
    <div class="feature">
      <div class="subsection">
        <a name="simulateneous_several_flash"></a>
        <h3 class="subsection_header">Debugging of multiple Flash applications</h3>
        <p>
          With CodeDrive it is possible to debug several Flash applications simultaneously with the
          full bebugging context available for each application: variables, breakpoints,
          program execution control, etc.
        </p>
      </div>
      <div class="subsection">
        <a name="simulateneous_flash_net"></a>
        <h3 class="subsection_header">Debugging of Flash and .NET applications</h3>
        <p>
          CodeDrive allows effective multi-tier .NET/Flash debugging. When your Flash code interact
          with .NET server you can simultaneously debug your Flash client in ActionScript
          and your .NET server in C++/C#/VB.NET.
        </p>
      </div>
      <div class="subsection">
        <a name="listening_mode"></a>
        <h3 class="subsection_header">Listening Mode</h3>
        <p>
          With the Listening Mode you can automatically access  the triggered Flash application while
          debugging several Flash applications.
        </p>
        <img class="lazyloaded bordered" width="604" height="303" src="/images/gray.gif" data-original="/images/debugger_features/listen_mode.png" alt="ListenMode"/>
        {include file='include/to_the_top_block.tpl'}
        <p>
          The debugger is realized according to Visual Studio principles: key combinations, standard commands
          and features work the same way as in Visual Studio. Learn more about debugging in Visual Studio in MSDN.
        </p>
      </div>
    </div>
  </div>

  <div class="features_block">
    <a name="flashlog_window"></a>
    <h2>FlashLog Window</h2>
    <div class="feature">
      <p>
        Standard Flash trace functionality is also available in CodeDrive. When running the project,
        you will see the result of the trace statement execution in the FlashLog Window. You only need to
        install the Debug version of Flash Player - no additional setup is necessary.
      </p>
      <img class="lazyloaded bordered" width="532" height="203" src="/images/gray.gif" data-original="/images/features/flash_log_window.png" alt="FlashLog Window"/>
      {include file='include/to_the_top_block.tpl'}
    </div>
  </div>

  </div>
</div>